<!--
* description: 车系下拉框（多选，单选）,支持搜索
* author: liyanm
* createdDate: 2019-07-27
*   2019-08-09 修改文字溢出效果-封装 liyanm
*   2019-09-21 listQuery中 brandCode改为carBrandCode-徐浪帆
-->
<template>
  <section>
    <el-col
      v-show="curIsShow"
      :key="fullComponentKey"
      :span="span"
    >
      <lableName
        :validrule="validrule"
        :cur-label-name="curLabelName"
        :is-show-label="isShowLabel"
        :is-require="isRequire"
      />
      <el-select
        v-model="modelCode"
        :multiple="isMul"
        collapse-tags
        :filterable="filterable"
         :placeholder="placeholder"
        :clearable="clearable"
        :disabled="disabled"
        size="small"
        @clear="clearCode"
        @change="sendCode"
      >
        <el-option
          v-for="item in optionDatas"
          :key="item[optionFields.length > 1 ? optionFields[0] : defOptionFields[0]]"
          :label="item[optionFields.length > 1 ? optionFields[1] : defOptionFields[1]]"
          :value="item[optionFields.length > 1 ? optionFields[0] : defOptionFields[0]]"
        >{{ item[optionFields.length > 1 ? optionFields[1] : defOptionFields[1]] }}</el-option>
      </el-select>
      <validateFormate
        :cur-label-name="curLabelName"
        :validrule="validrule"
      />
    </el-col>
  </section>
</template>
<script>
import { orgApis } from '@/api/apiList/org'
import { dropdownMixins } from '@/components/mixins/dropdownMixins'
// import lableName from "@/components/lableName";
// import validateFormate from "@/components/validateFormate";
export default {
  name: 'OrgcarCode',
  components: {
    lableName: () => import('@/components/lableName'), // 标题溢出样式组件
    validateFormate: () => import('@/components/validateFormate') // 校验提示样式组件
  },
  // 组件混入对象：{props[span,isShowLabel,code,isMul,labenName] data[modelCode,optionDatas,listQuery] methods[queryTable,sendCode]}
  mixins: [dropdownMixins],
  props: {
    // 品牌编号
    carBrandCode: { type: String, default: '' },
    // 初始化加载第一个数据
    initFirst: { type: Boolean, default: false }
  },
  data() {
    return {
      // 默认绑定数据对象字段
      defOptionFields: ['carSeriesId', 'carSeriesCn'],
      placeholder: this.$t('sys.tips.esTip0'),
      curLabelName:
        this.labelName === ''
          ? this.$t('org.label.carSerise') /* 车系*/
          : this.labelName,
      // API配置对象
      apiConfig: orgApis.mdmVeCarSeriesQueryListForPage,
      // 表格中台返回网格的字段
      apiQueryRow: [
        'carSeriesId',
        'carSeriesCode',
        'carSeriesCn',
        'carSeriesEn',
        'isEnable',
        'carBrandCode',
        'sapCarseriesCode',
        'sCarseriesDesc'
      ],
      // 查询条件
      listQuery: {
        isEnable: '1',
        carBrandCode:
          this.carBrandCode === ''
            ? this.$store.getters.orgInfo.BRAND_CODE
            : this.carBrandCode
      }
    }
  },
  created() {
    const that = this
    // 初始化数据
    if (this.apiConfig !== null && this.apiQueryRow.length > 0 && this.optionDatas.length === 0 && this.lookuptype !== '_is_null_code_') {
      // 设置网格中组件查询字段（如果当前组件存在于网格中）
      this.$utils.setRowQueryFields(this, 'listQuery')

      if (this.setQueryFields() !== true) {
        // 设置组件间联动值后执行
        if (this.isAsync !== true) {
          // 非异步加载数据（同步）
          this.queryTable(this.apiConfig, this.apiQueryRow, function() {
            if (that.initFirst) {
              that.setModelCode(that.optionDatas[0].carSeriesId)
              that.sendCode()
            }
          })
        } else {
          // 异步加载数据
          this.setDefaultOpiton()
        }
      }
    }
  }
}
</script>
